<div class="home-body">
  <div class="swiper-container">
    <div class="swiper-wrapper">
      <div class="swiper-slide" *ngFor="let banner of homeBanner">
          <img src="{{imgUrl + banner.image_url}}"/>
      </div>
    </div>
    <div class="swiper-pagination"></div>
  </div>
  <div class="home-content-body" [ngStyle]="{'background':backIamge.length > 0?'url(' + backIamge[0]['img'] + ')':0}">
    <div class="home-line">
      <h2>品牌排行榜</h2>
    </div>
    <div class="home-content">
      <div class="home-content-left">
        <div (click)="getRankData(1 ,'网络人气榜')">网络人气榜</div>
        <div (click)="getRankData(2 ,'品牌价值榜')">品牌价值榜</div>
        <div (click)="getRankData(3 ,'爱心公益榜')">爱心公益榜</div>
        <div (click)="getRankData(4 ,'支持赞助榜')">支持赞助榜</div>
        <div (click)="getRankData(5 ,'品牌实力榜')">品牌实力榜</div>
        <div (click)="getRankData(6 ,'与时俱进榜')">与时俱进榜</div>
        <div (click)="getRankData(7 ,'幸福指数榜')">幸福指数榜</div>
        <div style="border: none;"></div>
      </div>
      <div class="home-content-center">
        <div class="center-bar">
          {{title}}
        </div>
        <div class="home-tab">
          <span *ngFor="let item of homeTab let i = index" (click)="tabClick(i,item)" [class]="i == select ? 'home-tab1' : 'home-tabs1'">{{item}}</span>
        </div>
        <div class="home-cont">
          <div class="home-lists">
            <ul>
              <li *ngFor="let brands of brandsLists let i = index">
                <img style="width: 1.3rem;margin: 0 .35rem;" *ngIf="i == 0" src="./assets/img/one.png">
                <img style="width: 1.3rem;margin: 0 .35rem;" *ngIf="i == 1" src="./assets/img/two.png">
                <img style="width: 1.3rem;margin: 0 .35rem;" *ngIf="i == 2" src="./assets/img/three.png">
                <span *ngIf="i >= 3" class="raking">&nbsp;{{i + 1}}&nbsp;</span>
                <img class="home-list-img" src="{{brands.logo}}">
                <span class="home-list-name">{{brands.name}}</span>
                <span *ngIf="params['state'] == 1" class="home-list-value">{{brands.Popularity}}人气</span>
                <span *ngIf="params['state'] == 2" class="home-list-value">{{brands.value}}万元</span>
                <span *ngIf="params['state'] == 3" class="home-list-value">{{brands.Charity}}万元</span>
                <span *ngIf="params['state'] == 4" class="home-list-value">{{brands.Support}}元</span>
                <span *ngIf="params['state'] == 5" class="home-list-value">{{brands.GProfit}}万元</span>
                <span *ngIf="params['state'] == 6" class="home-list-value">{{brands.Innovation}}创新力</span>
                <span *ngIf="params['state'] == 7" class="home-list-value">{{brands.Happiness}}%</span>
                <button (click)="voteAdd(brands.id)" *ngIf="params['state'] == 1"><span *ngIf="voteId == brands.id">已投票</span><span *ngIf="voteId != brands.id">投票</span></button>
              </li>
            </ul>
            <p *ngIf="noMore" style="text-align: center;font-size: 14px">暂无更多数据...</p>
            <!--<button class="home-list-button">更多</button>-->
          </div>
        </div>
        <!-- <div *ngFor="let img of backIamge">
           <img src="{{imgUrl + img.img}}" alt="">
         </div>-->

      </div>
      <div class="home-content-right">
        <div class="home-ranking">
          <div class="home-raking-top">
            <div>
              <img style="vertical-align: middle" src="./assets/img/huo.png">
              <h2 style="vertical-align: middle;display: inline-block">月排行</h2>
            </div>
            <!--<div>-->
            <!--<select [(ngModel)]="params2['types']" (ngModelChange)="getEnterprise()">-->
            <!--<option value="1">1月份</option>-->
            <!--<option value="2">2月份</option>-->
            <!--<option value="3">3月份</option>-->
            <!--<option value="4">4月份</option>-->
            <!--<option value="5">5月份</option>-->
            <!--<option value="6">6月份</option>-->
            <!--<option value="7">7月份</option>-->
            <!--<option value="8">8月份</option>-->
            <!--<option value="9">9月份</option>-->
            <!--<option value="10">10月份</option>-->
            <!--<option value="11">11月份</option>-->
            <!--<option value="12">12月份</option>-->
            <!--</select>-->
            <!--</div>-->
          </div>
          <div class="home-raking-list">
            <ul>
              <li *ngFor="let item of rankData let i = index">
                <img *ngIf="i == 0" src="./assets/img/one.png">
                <img *ngIf="i == 1" src="./assets/img/two.png">
                <img *ngIf="i == 2" src="./assets/img/three.png">
                <span *ngIf="i >= 3" class="raking2">{{i + 1}}</span>
                {{item.name}}
              </li>
              <p *ngIf="noMoreRankList" style="font-size: 14px;text-align: center">暂无更多数据...</p>
            </ul>
            <div style="text-align: right">
              <button class="home-list-more" [routerLink]="['rank',{types:params2['types'],state:params2['state'],type:params2['type'],years:years}]">更多</button>
            </div>
          </div>
        </div>

        <div class="home-rank-all">
          <h2>历年排行总览</h2>
          <div class="home-year">
            <button [ngClass]="selectYear == 3 ? 'select-year':''" (click)="getEnterpriseYear(years - 2 , 3)">{{years - 2}}</button>
            →
            <button [ngClass]="selectYear == 2 ? 'select-year':''" (click)="getEnterpriseYear(years - 1 , 2)">{{years - 1}}</button>
            →
            <button [ngClass]="selectYear == 1 ? 'select-year':''" (click)="getEnterpriseYear(years , 1)">{{years}}</button>
          </div>
          <div class="home-raking-list2">
            <ul>
              <li *ngFor="let item of rankDataList let i = index">
                <img *ngIf="i == 0" src="./assets/img/one.png">
                <img *ngIf="i == 1" src="./assets/img/two.png">
                <img *ngIf="i == 2" src="./assets/img/three.png">
                <span *ngIf="i >= 3" class="raking2">{{i + 1}}</span>
                {{item.name}}
              </li>
            </ul>
            <p style="text-align: center;font-size: 12px;margin-top: 10px" *ngIf="noMoreRank">暂无更多数据...</p>
            <div style="text-align: right">
              <button class="home-list-more" [routerLink]="['rank',{years:years,state:params['state'],type:params['type']}]">更多</button>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

